<template>
  <div>

    <el-button type="text" @click="addDialogFormVisible = true">新增</el-button>
    <el-button type="text" @click="deleteAssign">删除</el-button>

    <el-table
      highlight-current-row
      :data="tableData"
      @current-change="handleCurrentChange"
      style="width: 100%">

      <el-table-column
        prop="ynBalance"
        label="金额">
      </el-table-column>
      <el-table-column
        prop="ynDay"
        label="日期">
      </el-table-column>
      <el-table-column
        prop="ynReason"
        label="说明">
      </el-table-column>
    </el-table>

    <el-dialog title="" :visible.sync="addDialogFormVisible">
      <el-form :model="form" label-width="15%">
        <el-form-item label="金额">
          <el-input v-model="form.ynBalance" autocomplete="off"></el-input>
        </el-form-item>

        <el-form-item label="日期">
          <el-date-picker
            v-model="form.ynDay"
            format="yyyy-MM-dd"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="说明">
          <el-input v-model="form.ynReason" autocomplete="off"></el-input>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addDialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveOrUpdate">确 定</el-button>
      </div>
    </el-dialog>

  </div>


</template>

<script>

import moment from "moment";
import {Message} from "element-ui";

export default {
  name: "car",
  created() {
    this.form.ynDay = moment().format('yyyy-MM-DD')
    this.getYnAssign()
  },
  methods: {
    getYnAssign: function () {
      this.axios.post('/ynCarAccount/list', {ynCarAccountType: 2}).then(res => {
        if (!!res.data.data) {
          this.tableData = res.data.data;
        }
      })
    },
    changeDate(val) {
      // this.form.ynDay = moment(val).format('yyyy-MM-dd');
    },
    inputDay() {
      this.axios.post('/ynCarAccount/saveOrUpdate', {
        ...this.addForm,
        ynDay: moment(this.addForm.ynDay).format('yyyy-MM-DD')
      }).then(res => {
        if (200 === res.data.code) {
          this.inputDayDialog = false;
          Message.success('成功');
        }
      })
    },
    saveOrUpdate() {
      this.axios.post('/ynCarAccount/saveOrUpdate', {
        ...this.form,
        ynDay: !!this.form.ynDay ? moment(this.form.ynDay).format('yyyy-MM-DD') : ''
      }).then(res => {
        if (200 === res.data.code) {
          Message.success('成功');
          this.addDialogFormVisible = false;
          this.getYnAssign();
          this.form.ynDay = moment().format('yyyy-MM-DD');
          this.form.ynBalance = ''
          this.form.ynReason = ''
          this.radioValue = null;
        }
      })
    },
    update() {
      this.addDialogFormVisible = true;
    },
    deleteAssign() {
      this.axios.post('/ynCarAccount/delete', this.currentRow).then(res => {
        if (200 === res.data.code) {
          Message.success("成功");
          this.getYnAssign();
        }
      })
    },
    handleCurrentChange(val) {
      this.currentRow = val;
    }
  },
  data() {
    return {
      tableData: [],
      currentRow: null,
      form: {
        ynBalance: '',
        ynBalanceFinally: '',
        ynBillType: '2',
        ynDay: '',
        ynReason: ''
      },
      query: {dep: ''},
      addDialogFormVisible: false,
      monthTargetDialog: false,
      inputDayDialog: false,
      radioValue: '', // 选中的单选按钮的值
      radioOptions: [] // 存储从接口获取的数据
    }
  }
}
</script>

<style scoped>

</style>
